<template>
	<view>
		<!-- 收银台 -->
		<view class="edgeInsetTop"></view>
		<view class="wanl-pay">
			<view class="price-box">
				<text class="text-df">{{order_no}}</text>
				<text class="wanl-pip text-price margin-top-sm">{{price}}</text>
			</view>
			<view class="list-box">
				<view class="item" v-for="(item, index) in payList" :key="index">
					<text :class="'wlIcon-'+ item.type +'-pay'"></text>
					<view class="action">
						<text class="title wanl-pip">{{item.name}}</text>
						<view>{{item.describe}}</view>
					</view>
					<view class="radio text-xxl" v-if="item.state" @tap="onSelect(index)">
						<text v-if="item.select" class="wlIcon-xuanze-danxuan wanl-orange"></text>
						<text v-else class="wlIcon-xuanze wanl-gray-light"></text>
					</view>
					<view class="radio text-xxl" v-else>
						<text class="wlIcon-xuanze-danxuan wanl-gray-light"></text>
					</view>
				</view>
			</view>
			<view v-if="disabled">
				<button class="mix-btn wanl-bg-redorange"> <text
						class="wlIcon-jiazai wlIconfont-spin margin-right-xs"></text>正在支付中... </button>
			</view>
			<view v-else>
				<button v-if="payNum == 1" class="mix-btn wanl-bg-redorange" @tap="confirm()"> 确认支付 </button>
				 
				<button v-else class="mix-btn wanl-bg-redorange" @tap="confirm()"> 合并支付 </button>
			</view>
		</view>
	</view>
</template>

<script>
	import wx from 'weixin-js-sdk'
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				// token: '',
				disabled: false,
				price: '0.00',
				isbalance: false,
				order_type: 'goods',
				order_no: '',
				order_pay_no: '',
				payNum: 1, // 支付方式 独立支付-合并支付
				payList: [],
				miniProgramId: '',
				path: ''
			}
		},
		props: {
			token: {
				type: String,
				default: '',
			},
			payData: {
				type: Array,
				default: [],
			}
		},
		computed: {
			...mapState(['user'])
		},
		watch: {
			price(val, newval) {
				if (val <= parseFloat(this.$store.state.user.money)) {
					this.isbalance = true;
					this.getPayment();
				}
			}
		},
		mounted() {
			this.getData();

		},
		methods: {
			async getData() {
				// await uni.request({
				// 	url: '/wanlshop/pay/getBalance',
				// 	method: 'POST',
				// 	success: res => {
				// this.$store.commit('user/setUserInfo', {money: res.data});
				// 获取支付列表
				this.getPayment();
				// 	}
				// });
				console.log(this.payData, 9999);
				if (this.payData) {
					var sum = 0
					var data = this.payData
					var order_ids = [];
					console.log(data, data.length, 9999);
					if (data.length <= 1) {

						this.price = data[0].price;
						console.log(data[0].price, 32131321313, this.price);
						this.order_type = data[0].type;
						this.order_no = `${data[0].type == 'groups' ? '拼团':''}订单号：${data[0].order_no}`;
						this.order_pay_no = data[0].pay_no;
						this.order_id = data[0].order_id;
					} else {
						data.forEach(item => {
							sum = this.$wanlshop.bcadd(sum, item.price);
							order_ids.push(item.order_id);
						});
						this.price = sum;
						this.order_id = order_ids;
						this.payNum = data.length;
						this.order_no = '合并支付 ' + data.length + '个订单';
					}
          uni.setStorageSync('purchase_amount',this.price)
					this.token = option.token;
				} else if (option.order_id) {
					uni.showLoading({
						title: '结算中...'
					});
					await uni.request({
						url: '/wanlshop/pay/getPay',
						method: 'POST',
						data: {
							order_id: option.order_id,
							order_type: option.order_type
						},
						success: res => {
							uni.hideLoading();
							this.token = res.data.token;
							this.price = res.data.price;
							this.order_type = res.data.order_type;
							this.order_no =
								`${res.data.order_type == 'groups' ? '拼团':''}订单号：${res.data.order_no}`;
							this.order_pay_no = res.data.pay_no;
							this.order_id = res.data.order_id;
              uni.setStorageSync('purchase_amount',this.price)
						}
					});
				} else {
					console.log('非法访问');
				}
			},
			getPayment() {
				let method = 'wap';
				this.payList.push({
					name: '微信支付',
					describe: '推荐使用微信支付',
					type: 'wechat',
					method: method,
					state: true,
					select: this.isbalance ? false : true
				});
				uni.getProvider({
					service: "payment",
					success: (e) => {
						e.provider.map((value) => {
							if (value == 'wxpay') {
								this.payList.push({
									name: '微信支付',
									describe: '推荐使用微信支付',
									type: 'wechat',
									method: method,
									state: true,
									select: this.isbalance ? false : true
								});
							}
						})
					}
				});
			},
			//确认支付	
			confirm() {
				let data = null;
				if (this.disabled) {
					return;
				}
				this.payList.map((value, index, array) => {
					if (value.select) {
						data = value;
					} else {
						return;
					}
				});
				this.wanlPay(data);

			},
			async wanlPay(data, code = null) {
				let order_str = this.order_no.slice(4);
				// order_str.sp
				await uni.request({
					url: '/pay/h5',
					method: 'POST',
					data: {
						order_id: this.order_id,
						order_no: order_str,
					},
					success: res => {
						console.log(res.data, '支付请求');
            window.location.href = res.data.payUrl
            // let data = res.data.data
						// this.miniProgramId = data.miniProgramId
						// this.path = data.payPath
						// var timestamp = new Date().getTime();
						// wx.config({
						// 	debug: false,
						// 	appId: data.appId,
						// 	timestamp: timestamp,
						// 	nonceStr: 'nonceStr',
						// 	signature: 'signature',
						// 	jsApiList: ['chooseImage', 'previewImage'], //必写，否则不显示
						// 	openTagList: ['wx-open-launch-weapp'] //必写，否则不显示
						// });

					}
				});
			},
			onSelect(key) {
				this.payList.map((value, index, array) => {
					if (index == key) {
						value.select = !value.select;
					} else {
						value.select = false;
					}
				});
			},
			// 支付成功
			paySuccess() {
				this.disabled = false;
				if (this.order_type === 'goods') {
					this.$store.commit('statistics/order', {
						pay: this.$wanlshop.bcsub(this.$store.state.statistics.order.pay, this.payNum),
						delive: this.$wanlshop.bcadd(this.$store.state.statistics.order.delive, this.payNum)
					});
				}
				this.$wanlshop.to(`/pages/page/success?type=pay&order_type=${this.order_type ? this.order_type:'goods'}`);

			}
		}
	}
</script>

<style>
	page {
		background-color: white;
	}

	radio-group {
		display: block;
	}
</style>